<template>
  <div class="select-city-btn-component" @click="topPath('/pages/select-city/index')">
    <Location2 color="#858a99" size="0.6rem"></Location2>
    <div class="cityname">{{getSelectCityinfo?getSelectCityinfo.cityName:'请选择'}}</div>
    <TriangleDown color="#858a99" size="0.6rem"></TriangleDown>
  </div>
</template>
<script setup lang="ts">
import { Location2, TriangleDown } from "@nutui/icons-vue-taro";
import Taro from "@tarojs/taro";
import { storeToRefs } from "pinia";
import { useLocationStore } from "../../store";
const locationStore = useLocationStore()
const { getSelectCityinfo } = storeToRefs(locationStore);

const topPath = (url: string) => {
  Taro.navigateTo({ url });
};
</script>
<style lang="scss">
.select-city-btn-component {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  padding: 0 0.3rem;
  .cityname {
    font-size: 0.6rem;
    padding: 0 0.2rem;
  }
}
</style>